<template>
	<view>
		<pageheader :setting="settingdata"></pageheader>
		<view class="videoList">
			<view class="item" v-for="(item,index) in list" :key="index">
				<!-- <image class="img" :src="item.image" mode="aspectFill" @click="is_edit?'':'torebo'">
				</image -->
				<video class="video" :src="item.video"></video>

				<view class="introduce flex_bet_align">
					<view class="username clamp1">{{item.content}}</view>
					<view class="sandian" @click="edit(item)"> ... </view>
				</view>
			</view>
		</view>

		<u-popup v-model="is_edit" mode="bottom " border-radius="14" closeable>
			<view class="popup_box">
				<view class="cancel" @click="editvideo"> <text class="icon icon-xiugai"></text>编辑</view>
				<view class="cancel" @click="cancel_follow" style="margin-top: 25rpx;">
					<text class="icon icon-shanchu2"></text>删除
				</view>
			</view>
		</u-popup>

		<view class="not_more" v-if="list.length<1">
			<image src="../static/img/wshangji.png" mode="widthFix"></image>
			<view class="text">暂无关注</view>
		</view>
	</view>
</template>

<script>
	var _this, $paginator;
	export default {
		data() {
			return {
				settingdata: {
					name: '视频管理',
					bgColor: '#fff',
					titleColor: '#000000',
					showNav: true,
					showTypes: 0,
					position: "myVideo"
				},
				list: [],
				is_edit: false,

				checkitem: {},
			}
		},
		onLoad() {
			_this = this
			$paginator = new _this.$paginator(_this.$api)
			_this.getdata(true)
		},
		onShow() {
			if (_this.isonshow) {
				_this.is_edit = false

				$paginator = new _this.$paginator(_this.$api)
				_this.getdata(true)
				_this.isonshow = false
			}
		},

		methods: {
			edit(item) {
				_this.checkitem = item
				_this.is_edit = true
			},

			getdata: function(firstLoad = false) {
				$paginator.getData('getvideo', {
					pageSize: 10
				}, (data) => {
					if (firstLoad) {
						_this.list = data.list ? data.list : []
					} else {
						_this.list = _this.list.concat(data.list)
					}
					console.log(_this.list,"111111111111111111111111",data.data)
					
				})
			},

			editvideo() {
				console.log(_this.checkitem.id)
				uni.navigateTo({
					url: '/home/submit/submit?id=' + _this.checkitem.id + '&cometype=list'
				})
			},

			cancel_follow() {
				uni.showModal({
					title: '提示',
					content: '是否确认删除视频',
					success: function(res) {
						if (res.confirm) {
							_this.$api.get("delcontent", {
								id: _this.checkitem.id,
								client_uid: uni.getStorageSync("client_uid") ? uni.getStorageSync(
									"client_uid") : 0
							}).then(data => {
								uni.showToast({
									title: '删除成功',
									icon: 'none',
									duration: 2000,
									success: function() {
										setTimeout(function() {
											$paginator = new _this.$paginator(_this.$api)
											_this.getdata(true)
										}, 1000);
									}
								})

							});
						}
					}
				});
			},
		},
		onReachBottom: function() {
			$paginator.nextPager(() => {
				_this.getdata()
			})
		},
	}
</script>

<style lang="scss" scoped>
	.operate {
		background-color: #FFFFFF;
		padding: 20rpx;
	}

	.videoList {
		padding: 30rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		background-color: #FFFFFF;
		border-radius: 20rpx;
	}

	.videoList .item {
		width: 690rpx;
		position: relative;
		margin-bottom: 30rpx;
	}

	.videoList .item .img {
		border-radius: 30rpx;
	}

	.videoList .item .video {
		width: 100%;
		height: 410rpx;
		border-radius: 5rpx;
	}

	.videoList .item .introduce .username {
		font-size: 28rpx;
		width: 600rpx;
	}

	.videoList .item .introduce .sandian {
		line-height: 14rpx;
		height: 52rpx;
		font-size: 58rpx;
	}

	.upvideo {
		position: fixed;
		bottom: 100rpx;
		width: 100%;
		display: flex;
		justify-content: center;
		z-index: 1;
	}

	.add_box {
		width: 88rpx;
		height: 88rpx;
		border-radius: 50rpx;
		background: linear-gradient(90deg, #ff9c16 0%, #ff6600 100%);
		color: #FFFFFF;
		line-height: 88rpx;
		text-align: center;
	}

	.add_box text {
		font-size: 75rpx;
	}

	.check_box {
		display: inline-block;
		position: absolute;
		right: -10rpx;
		top: -12px;
		z-index: 1;

	}

	.van-checkbox__icon {
		border-color: #646C7E;
	}

	.foot_box {
		width: 100%;
		padding: 18rpx 20rpx 21rpx;
		background-color: #ffffff;
		position: fixed;
		bottom: 0;
		left: 0;
		line-height: 55rpx;
		align-items: center;
		z-index: 10;
	}

	.foot_box .checkbox {
		line-height: 55rpx;
	}

	.checkbox {
		line-height: 96rpx;
		width: 50rpx;
		color: #b1b8c8;
	}

	.popup_box {
		width: 100%;
		padding: 30rpx;
	}

	.popup_title {
		width: 600rpx;
	}

	.cancel {
		padding: 23rpx 0;
		margin-top: 50rpx;
		text-align: center;
		/* color: #666666; */
		background: #F6F6F6;
		font-size: 32rpx;
		border-radius: 15rpx;
	}

	.cancel text {
		margin-right: 8rpx;
	}
</style>
